/**
 * Created by JLB1 on 2017/2/7.
 */

import React, { Component, PropTypes } from 'react'
import ReactDOM from "react-dom"
import AJAX from "../../lib/ajax";
import Tools from "../../lib/tools"
import { addErrorListener } from "../../lib/handleError"
import weixinShare from '../../lib/weixinShare';
import Loading from "../../components/Loading"
require('../../lib/rem')
import wx from "wx"
require('../../styles/common.less');
require('../../styles/lux.less')
require('../../styles/resetWeui.less');
require('./MyPackageRecipentDetail.less')
import AdBlock from "../../components/AdBlock"

class App extends Component {
    constructor(props) {
        super(props)
        this.state = {
            isLoaded: false,
            aditem_id: Tools.getParams().aditem_id,
            data: {
                id: '',
                type: 1,//1 柜体 2货架 3 堆
                adImgSrc: '',
                addr: '',
                wait_time: '',
                settle_amount: '',
                balance: '',
                exp_code: '',
                exp_name: '',
                open_code: '',
                contact_phone: '',
                contact_desc: '',
            },
            isReceive: false,//是否获取到数据
            findFriendClass: 'sendFriend'
        }


        this.handlePickup = this.handlePickup.bind(this);
        this.findFriendToPickup = this.findFriendToPickup.bind(this);
        this.hideFindFriend = this.hideFindFriend.bind(this);
        this.shareFriend = this.shareFriend.bind(this)
    }

    componentWillMount() {
        addErrorListener()();
        // 取url参数，wx_type
        window.localStorage.setItem('wx_type', Tools.getParams().wx_type === 'garden' ? Tools.getParams().wx_type : 'logis');

        weixinShare.hideAll()
        const params = Tools.getParams()
        const {
            order_id,
            aditem_id,
        } = params
        if (+aditem_id) {
            // 统计点击
            AJAX.request('advertSave', { advertId: aditem_id, type: 2 }, (res) => {
                const { code } = res;
                if (code === 0) {
                    AJAX.request("get_advert_url", { advert_id: aditem_id, action: 1 }, (data) => {
                        if (data.body.url) {
                            window.location.replace(data.body.url);
                        }
                        else {
                            //跳转首页
                            const wx_type = window.localStorage.getItem('wx_type');
                            window.location.href = `./PickUp?wx_type=${wx_type}`;
                        }
                    })
                }
            });

        } else {
            let out_time
            if (params.out_time) {
                out_time = decodeURI(params.out_time)
            }
            AJAX.request("order_detail", { order_id, aditem_id }, (data) => {
                if (data.code === 0) {
                    const dataBody = data.body
                    let copyData = {
                        id: dataBody.id,
                        order_type: dataBody.order_type,
                        type: dataBody.storage_info.type,
                        addr: dataBody.storage_info.addr,
                        wait_time: dataBody.wait_time,
                        settle_amount: (dataBody.settle_amount / 100).toFixed(2),
                        balance: (dataBody.balance / 100).toFixed(2),
                        exp_code: dataBody.exp_code,
                        exp_name: dataBody.exp_name,
                        open_code: dataBody.open_code,
                        contact_phone: dataBody.contact_phone,
                        contact_desc: dataBody.contact_desc,
                        in_time: dataBody.in_time,
                        out_time: out_time ? out_time : dataBody.out_time
                    };
                    this.setState({
                        isLoaded: true,
                        data: copyData,
                        isReceive: true
                    })
                    this.shareFriend(data.body)
                }
            })
        }
    }

    //分享给朋友
    shareFriend(detail) {
    }

    componentDidMount() {
        AJAX.appendBaiduAnalysis()
    }

    handlePickup() {
        if (this.state.data.type != 1) {
            return
        }
        window.location.href = './PickUpDetailOne?order_id=' + Tools.getParams().order_id
    }

    //找人代收
    findFriendToPickup() {
        this.setState({
            findFriendClass: 'sendFriend show'
        })
    }

    //隐藏找人代收
    hideFindFriend() {
        this.setState({
            findFriendClass: 'sendFriend hide'
        })
    }

    //信报
    renderMail() {
        return (
            <div className="expressDetailBox">
                <div className="paddingBox">
                    <div className="expressDetailItem">
                        <p className="expressDetail_title">取件密码：</p>
                        <p className="expressDetail_info">{this.state.data.open_code}</p>
                        {
                            this.state.data.open_code
                                ? <p><a className="payBtn color-red">已无效</a></p>
                                : null
                        }
                    </div>
                </div>
                <div className="paddingBox beforeLine">
                    <div className="expressDetailItem">
                        <p className="expressDetail_title">取件时间：</p>
                        <p className="expressDetail_info">{this.state.data.out_time}</p>
                    </div>
                </div>
                <div className="paddingBox beforeLine">
                    <div className="expressDetailItem">
                        <p className="expressDetail_title">存放位置：</p>
                        <p className="expressDetail_info">{this.state.data.addr}</p>
                    </div>
                </div>
                <div className="paddingBox beforeLine">
                    <div className="expressDetailItem ">
                        <p className="expressDetail_title">{this.state.data.exp_name}：</p>
                        <p className="expressDetail_info"></p>
                    </div>
                </div>
                <div className="paddingBox beforeLine">
                    <div className="expressDetailItem ">
                        <p className="expressDetail_title">投递时间：</p>
                        <p className="expressDetail_info">{this.state.data.in_time}</p>
                    </div>
                </div>
                <div className="paddingBox beforeLine">
                    <div className="expressDetailItem">
                        <p className="expressDetail_title">{this.state.data.contact_desc}：</p>
                        <p className="expressDetail_info"><a
                            href={"tel:" + this.state.data.contact_phone}>{this.state.data.contact_phone}</a></p>
                    </div>
                </div>
            </div>
        )
    }

    //除了信报
    renderOther() {
        return (
            <div className="expressDetailBox">
                <div className="paddingBox">
                    <div className="expressDetailItem">
                        <p className="expressDetail_title">取件密码：</p>
                        <p className="expressDetail_info">{this.state.data.open_code}</p>
                        {
                            this.state.data.open_code
                                ? <p><a className="payBtn color-red">已无效</a></p>
                                : null
                        }
                    </div>
                    <div className="expressDetailItem">
                        <p className="expressDetail_title">取件时间：</p>
                        <p className="expressDetail_info">{this.state.data.out_time}</p>
                    </div>
                </div>
                <div className="paddingBox beforeLine">
                    <div className="expressDetailItem">
                        <p className="expressDetail_title">存放位置：</p>
                        <p className="expressDetail_info">{this.state.data.addr}</p>
                    </div>
                </div>
                <div className="paddingBox beforeLine">
                    <div className="expressDetailItem">
                        <p className="expressDetail_title">取件费用：</p>
                        <p className="expressDetail_info">{this.state.data.settle_amount}元</p>
                    </div>
                </div>
                <div className="paddingBox beforeLine">
                    <div className="expressDetailItem ">
                        <p className="expressDetail_title">{this.state.data.exp_name}：</p>
                        <p className="expressDetail_info">{this.state.data.exp_code}</p>
                    </div>
                    <div className="expressDetailItem ">
                        <p className="expressDetail_title">投递时间：</p>
                        <p className="expressDetail_info">{this.state.data.in_time}</p>
                    </div>
                    <div className="expressDetailItem">
                        <p className="expressDetail_title">{this.state.data.contact_desc}：</p>
                        <p className="expressDetail_info"><a
                            href={"tel:" + this.state.data.contact_phone}>{this.state.data.contact_phone}</a></p>
                    </div>
                </div>
            </div>
        )
    }

    render() {
        const { data, aditem_id, isLoaded } = this.state
        let content = null
        if (data.order_type === 4) {
            content = this.renderMail()
        } else {
            content = this.renderOther()
        }
        return (
            <div className="detailBg">
                {
                    isLoaded
                        ? <div>
                            {content}
                            <AdBlock type="8" aditem_id={aditem_id} />
                        </div>
                        : <Loading show="true" />
                }
            </div>
        )
    }
}
ReactDOM.render(<App />, document.getElementById('app'))
if (module.hot) {
    module.hot.accept();
}

